<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>流程图用例</title>
</head>
<body>
<textarea name="content" rows="10" placeholder="这里输入内容,支持Markdown语法.">
#### Using FlowChart

setting:

    {
        flowChart : true
    }

#### Example

```flow
st=>start: User login
op=>operation: Operation
cond=>condition: Successful Yes or No?
e=>end: Into admin

st->op->cond
cond(yes)->e
cond(no)->op
```

```flow
st=>start: Start|past:>http://www.google.com[blank]
e=>end: End|future:>http://www.google.com
op1=>operation: My Operation|past
op2=>operation: Stuff|current
sub1=>subroutine: My Subroutine|invalid
cond=>condition: Yes or No?|approved:>http://www.google.com
c2=>condition: Good idea|rejected
io=>inputoutput: catch something...|future

st->op1(right)->cond
cond(yes, right)->c2
cond(no)->sub1(left)->op1
c2(yes)->io->e
c2(no)->op2->e
```

```sequence
Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!
```
</textarea>
<style type="text/css">
    @import "../public/stylesheets/vendor/font.css";
    @import "../public/stylesheets/vendor/markdown.css";
    @import "../public/stylesheets/emoji/nature.css";
    @import "../public/stylesheets/emoji/object.css";
    @import "../public/stylesheets/emoji/people.css";
    @import "../public/stylesheets/emoji/place.css";
    @import "../public/stylesheets/emoji/Sysmbols.css";
    @import "../public/stylesheets/emoji/twemoji.css";
    @import "../public/stylesheets/vendor/font-awesome.css";
    @import "../public/stylesheets/vendor/sunburst.css";
</style>

<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/underscore/underscore-min.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/raphael/raphael.min.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/jquery/jquery-2.1.3.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/sequence-diagram/sequence-diagram-min.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/flowchart/flowchart.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/flowchart/jquery.flowchart.min.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/highlight/highlight.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/markdown/he.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/markdown/marked.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/markdown/to-markdown.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/markdown/jsHtmlToText.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/markdown/tab.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/markdown/config.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/markdown/emoji.js"></script>
<script type="text/javascript" charset="utf-8" src="../public/javascripts/vendor/markdown/bootstrap-markdown.js"></script>
<script type="text/javascript" charset="utf-8"
        src="../public/javascripts/vendor/markdown/locale/bootstrap-markdown.zh.js"></script>
<script>
    $("textarea").markdown({
        language: 'zh',
        fullscreen: {
            enable: true,
            debounce: 500
        },
        resize: 'vertical',
        localStorage: 'md',
        imgurl: '/c/imgUpload',
        base64url: '/c/imgUpload',
        flowChart : true
    });
</script>
</body>
</html>